.work-license {
  min-height: 100vh;
  min-width: 100vw;
  background-image: linear-gradient(#8bcaff, #fff);
  transition: background-color 0.4s ease-in-out;
  .work-license-container {
    padding: 0 10px;
    box-sizing: border-box;
    margin-bottom: 100px;
    .work-license-header {
      display: flex;
      align-items: center;
      // logo
      .work-license-logo {
        width: 120px;
        height: 30px;
        background-image: url(@/assets/images/logo.png);
        background-size: cover;
        background-position: center center; /*可选，用于居中显示背景图片*/
        background-repeat: no-repeat; /*可选，不重复显示背景图片*/
        padding-top: 10px;
        position: relative;
        right: 30px;
      }
      .work-license-title {
        color: #fff;
        position: relative;
        right: 50px;
        top: 5px;
      }
    }
    // 个人展示
    .work-license-person-profile {
      //height: 27vh;
      margin-top: 5px;
      background-color: #fff;
      border-radius: 10px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 20px 15px 0px 15px;
      box-sizing: border-box;
      .profile-left {
        display: flex;
        flex-direction: column;
        font-size: 12px;
        width: 70%;
        .profile-left-top {
          .profile-left-name {
            font-size: 1.4rem;
            font-weight: bold;
          }
          .profile-position {
            width: auto;
            border-radius: 10px;
            box-sizing: border-box;
            background-color: #0661a8;
            text-align: center;
            color: #fff;
            padding: 0 5px;
            margin-bottom: 5px;
          }
        }
        .profile-left-bottom {
          //display: flex;
          //flex-direction: column;
          margin-top: 20px;
          .profile-honor {
            width: 4rem;
            border-radius: 10px;
            background: linear-gradient(#3987ea, #0251c8);
            text-align: center;
            color: #fff;
            padding: 0 5px;
            margin-bottom: 5px;
          }
          img {
            height: 100px;
          }
        }
      }
      .profile-right {
        height: 100%;
        display: flex;
        margin-left: 50px;
        img {
          width: 100%;
          height: 100%;
        }
      }
    }
    // 个人介绍
    .work-license-person-intro  {
      border-radius: 10px;
      background-color: #fff;
      margin-top: 30px;
      .intro-block {
        height: 30px;
        background-color: #0661a8;
        border-top-left-radius: 10px;
        border-top-right-radius: 10px;
      }
      .intro-con {
        padding: 10px 20px;
        box-sizing: border-box;
        .intro-title {
          text-align: center;
          font-size: 1rem;
          font-weight: bold;
        }
        .intro-content {
          text-indent: 2em;
          font-size: 14px;
          margin-top: 10px;
        }
      }
    }
    // 温馨提示
    .work-license-tips {
      border-radius: 10px;
      background-color: #fff;
      margin-top: 30px;
      padding: 10px 20px;
      box-sizing: border-box;
      font-size: 14px;
    }
    // 丙程环保品牌介绍
    .brand-content {
      .brand-img {
        display: flex;
        flex-direction: column;
        margin-top: 20px;
        .brand-img-top {
          display: flex;
          .brand-img-left {
            width: 40%;
            display: flex;
            flex-direction: column;
          }
          .brand-img-right {
            width: 60%;
            display: flex;
            img {
              width: 50%;
              height: 160px;
            }
          }
        }
        .brand-img-bottom {
          display: flex;
          .brand-img-left {
            width: 40%;
            height: 160px;
            display: flex;
            img {
              width: 100%;
              height: 100%;
            }
          }
          .brand-img-right {
            width: 60%;
            height: 160px;
            display: flex;
            img {
              width: 50%;
              height: 100%;
            }
          }
        }
        img {
          width: 100%;
          height: 80px;
        }
      }
    }
    // 服务类别
    .service-type {
      ul {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        li {
          width: calc(100% / 2 - 5px);
          min-height: 100px;
          border-radius: 10px;
          margin-right: 10px;
          margin-bottom: 10px;
          &:nth-child(2n) {
            margin-right: 0;
          }
          .service-type-con {
            display: flex;
            flex-direction: column;
            border-radius: 10px;
            img {
              width: 100%;
              height: 106px;
              border-top-left-radius: 10px;
              border-top-right-radius: 10px;
            }
          }
          .service-type-block {
            height: 30px;
            background-color: #0661a8;
            line-height: 30px;
            text-align: center;
            text-indent: 0;
            span {
              color: #fff;
            }
          }
        }
      }
    }
    // 服务保障
    .service-guarantee {
      .service-guarantee-ul {
        border-radius: 10px;
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        position: relative;
        margin-top: 30px;
        .service-guarantee-tip {
          position: absolute;
          top: 0;
          left: 0;
          background: #0661a8;
          color: #fff;
          border-radius: 10px;
          text-indent: 0;
          padding: 0 10px;
        }
        .service-guarantee-li {
          width: calc(100% / 2 - 5px);
          min-height: 100px;
          border-radius: 10px;
          margin-right: 10px;
          margin-bottom: 10px;
          position: relative;
          top: 30px;
          &:nth-child(2n) {
            margin-right: 0;
          }
          .service-guarantee-con {
            display: flex;
            flex-direction: column;
            align-items: center;
            .service-guarantee-top {
              width: 120px;
              height: 120px;
              border-radius: 50%;
              position: relative;
              display: flex;
              img {
                width: 100%;
                height: 100%;
                border-radius: 50%;
                object-fit: cover;
              }
              span {
                font-size: 12px;
                position: absolute;
                left: calc(100% / 2 - 50px);
                bottom: 10px;
                display: inline-block;
                width: 100%;
                //color: #fff;
                font-weight: bold;
                text-shadow: -1px -1px 0 white, 1px 1px 0 white;
              }
            }
            .service-guarantee-bottom {
              display: flex;
              flex-direction: column;
              justify-content: center;
              align-items: center;
              margin-top: 10px;
              position: relative;
              right: 15px;
            }
          }
        }
      }
    }
  }
}